<!--Search Form -->
<?php
$search_val = $this->search_val;
$cat = $this->cat;

?>
<div id="wrapper" class="white-wrapper">
    <div class="container">
        <form method="get" action="/">
            <div class="div_extend_res">
                <div class=" eight columns" style="margin-bottom: 10px;">
                    <input type="text" name="search_val" style="width: 100%" class="text" id="search_topic" ">
                </div>
                <div class=" four columns" style="margin-bottom: 10px;">
                    <select style="float: left;width: 100%; height: 35px;}" name="search_cat" >
                        <option value=""> Tất cả danh mục </option>
                        <?php foreach($cat as $c) {?>
                            <option value="<?php echo $c->id; ?>"    ><?php echo $c->title ?></option>
                        <?php } ?>
                    </select>
                </div>
                <div class=" four columns res-hide">
                    <input type="submit" style="width: 100%;
    margin-top: 0px;
    height: 35px;" class="button medium color " id="send" value="Tìm">
                </div>
                <div class="clear"></div>
                <div class="extend">
                    <div class=" four columns" style="margin-bottom: 10px;">

                            <?php
                            $topic_types = Velacolib\Utility\Utility::getProductType();
                            foreach($topic_types as $key => $t) {?>
                                <?php echo $t; ?>
                                <input type="radio" name="search_type" value="<?php echo $key ?>" >
                            <?php }?>

                    </div>
                    <div class=" four columns" style="margin-bottom: 10px;">
                        <select style="float: left;width: 100%; height: 35px;}" name="search_loc" >
                            <option value=""> Tỉnh Thành </option>
                            <?php
                            $topic_location = Velacolib\Utility\Utility::getLocationArray();
                            foreach($topic_location as $key => $l) {?>
                                <option value="<?php echo $key; ?>"  ><?php echo $l; ?></option>
                            <?php }?>
                        </select>
                    </div>
                </div>
                <div class=" four columns res-show">
                    <input type="submit" style="width: 100%;
    margin-top: 0px;
    height: 35px;" class="button medium color " id="send" value="Tìm">
                </div>
                <div id="div_extend" class="res-hide"> Mở Rộng Tìm Kiếm </div>

            </div>
            <div id="div_extend_res" class="res-show"> Mở Rộng Tìm Kiếm </div>
        </form>



    </div>
    <!-- end: Container -->
</div>

<!--End Search Form -->

<!-- start: Wrapper -->
<div id="wrapper">

    <!-- start: Container -->
    <div class="container">
        <!-- start: Portfolio -->
        <div class="sixteen columns">

            <ul class="tabs-nav" style="float: right">
                <li ><a href="?view=grid"><i class="mini-ico-th"></i>Dạng lưới </a></li>
                <li><a href="?view=list"><i class="mini-ico-list"></i>Dạng danh sách</a></li>
            </ul>
            <div class="tabs-container white-wrapper">
                <div id="portfolio-wrapper">
                    <?php foreach($data as $item): ?>


                        <div class="sixteen columns portfolio-item">
                           <div class="three columns picture" style="height: 200px; overflow: hidden">
                              <a  href="/topic/detail/<?php echo $item->id ?>"><img   src="<?php echo $item->images ?>"></a>
                           </div>
                            <div class="nine columns topic-listing-title">
                               <h4> <a href="/topic/detail/<?php echo $item->id ?>">[ <?php echo Velacolib\Utility\Utility::getProductType($item->topic_type); ?></php>
                                       ] <?php echo $item->title; ?></a> </h4>
                                <h6>
                                    <a href="/?search_loc=<?php echo $item->topic_location; ?>">  <?php echo Velacolib\Utility\Utility::getLocationArray($item->topic_location); ?></a>
                                    <?php if($item->cat_id){ ?>
                                        <a href="/?search_cat=<?php echo $item->cat_id; ?>"> -  Mặc Hàng: <?php $topic_cat =  Velacolib\Utility\Utility::getTopicCat()->getCategories($item->cat_id); echo $topic_cat->title;  ?></a>
                                    <?php } ?>

                                </h6>
                                <div class="item-description alt">
                                    <?php echo  Velacolib\Utility\Utility::limit_words($item->full_description,50); ?>
                                </div>
                            </div>
                            <div class="three columns price-listing">
                                <div><span style="font-weight: bold;font-size: 18px;"><?php echo number_format($item->price) ?></span> VND</div>
                            </div>
                        </div>
                    <?php endforeach ?>
                </div>
                <!-- end: Portfolio -->
                <!--paginator -->
                <div class="row-fluid" align="center">
                    <?php
                    // add at the end of the file after the table
                    echo $this->paginationControl(
                    // the paginator object
                        $data,
                        // the scrolling style; see http://zf2.readthedocs.org/en/release-2.1.4/modules/zend.paginator.usage.html#rendering-pages-with-view-scripts
                        'sliding',
                        // the partial to use to render the control
                        array('partial/paginator.phtml', 'index'),
                        // the route to link to when a user clicks a control link
                        array(
                            'route' => 'home',
                            'child_route' => array(
                                'controller'=>'index',
                                'action' => 'index',


                            ),
                            'search_val'=>$search_val
                        )
                    );
                    ?>
                </div>
                <!--end paginator -->
            </div>
        </div>
    </div>
    <div class="container">
        <div style="margin: 0 auto" class="loading">Đang tải...</div>
    </div>
</div>
<script>

    var $page=2;
    var $temp = 0;
    $(document).ready(function(){
        $('.extend').toggle();
        $('#div_extend').click(function(){
            $('.extend').toggle();

            if($('.extend').is(':visible') == true ){

                $('#div_extend').empty();
                $('#div_extend').html('Thu Gọn Tìm Kiếm');
            }
            else{

                $('#div_extend').empty();
                $('#div_extend').html('Mở Rộng Tìm Kiếm');
            }
        }) ;

        if($(window).width()<= 767){
            $('.extend').show();
            $('.div_extend_res').toggle();
            $('#div_extend_res').click(function(){
                $('.div_extend_res').toggle();

                if($('.div_extend_res').is(':visible') == true ){

                    $('#div_extend_res').empty();
                    $('#div_extend_res').html('Thu Gọn Tìm Kiếm');
                }
                else{

                    $('#div_extend_res').empty();
                    $('#div_extend_res').html('Mở Rộng Tìm Kiếm');
                }
            }) ;

        }
        // window sroll load
        /*
         $(function(){
         // 20 kết quả mặc định
         var $window=$(window);
         var $loading=$('.loading');
         var host = 'http://'+window.location.host+'/';
         var curHost = window.location;
         var $status=true;
         // load content when page load
         $(window).on( 'scroll',function(eS){
         //scroll = 1 (at the bottom)
         //if at bottom load more topic
         if($(this).scrollTop() /( $(document).height() - $(this).height()) >=  0.8 && (curHost == host)  ){
         // initialize
         $status=false;
         var container = $('#portfolio-wrapper');
         //demo content.. ajax load here
         $.ajax({
         type:'get',
         url:'http://'+window.location.host+'/topic/fetchfornewuser',
         data:{page:$page},
         beforeSend:function(){
         $(".loading").fadeIn (500);
         },
         success:function(data){
         console.log(data);
         if(data!=''){
         container.append(data);
         }else{
         $temp = 1;

         }
         },
         complete:function(){
         $(".loading").fadeOut(500);
         $status=true;
         load = 0;
         },
         error:function(){
         //alert('Request time out');
         }
         });
         if($temp == 0){
         $page = parseInt($page) + 1;
         }



         }

         else{


         }
         });

         });    */
    })
</script>
<style>
    #div_extend, #div_extend_res {
        float: left;
        width: 100%;
        text-align: center;
        cursor: pointer;
        margin-top: 5px;
        margin-bottom: 5px;
    }
</style>